<script setup lang="ts">
const props = defineProps<{
  transparent?: "full" | "none";
  z?: string;
}>();

const bgCss = computed(() => {
  switch (props.transparent) {
    case "full":
      return "bg-gray-200";
    case "none":
      return "bg-transparent";
    default:
      return "bg-black/70";
  }
});
const zCss = computed(() => props.z ?? "z-10");
</script>

<template>
  <div :class="`fixed inset-0 ${bgCss} ${zCss}`">
    <slot></slot>
  </div>
</template>
